<include file="public@header"/>
<link href="__STATIC__/js/bootstrap-treeview.min.css" rel="stylesheet">
<script src="__STATIC__/js/bootstrap-treeview.min.js"></script>
</head>
<body>
<div class="wrap js-check-wrap">
	<div  class="row">
		<div style="width:27%;float:left;" id="tree">
		</div>
		<div style="width:72%;float:right;">
			<if condition="isset($class_info)">
			<form class="js-ajax-form" action="" method="post">
				<table class="table table-hover table-bordered table-list">
					<thead>
					<tr>
						<th width="15">
							<label>
								<input type="checkbox" class="js-check-all" data-direction="x" data-checklist="js-check-x">
							</label>
						</th>
						<th>班级ID</th>
						<th>班级名称</th>
						<th>教室</th>
						<th>任课教师</th>
						<th>课次</th>
						<th>满班人数</th>
						<th>教室地图</th>
					</tr>
					</thead>
					<foreach name="class_info" item="vo">
						<tr name='{$vo.id}' hidden="hidden">
							<td>
								<input type="checkbox" class="js-check" data-name="{$vo.name}" data-yid="js-check-y" data-xid="js-check-x" name="ids[]" value="{$vo.id}" title="ID:{$vo.id}">
							</td>
							<td><b>{$vo.id}</b></td>
							<td>{$vo.name}</td>
							<td>{$vo.classroom_id|default='未知'}</td>
							<td>{$vo.teacher|default='未知'}</td>
							<td>{$vo.class_number|default='未知'}</td>
							<td>{$vo.student_number|default='未知'}</td>
							<td>
								<if condition="isset($vo['map_img'])&&$vo['map_img']!=''">
									<img src="{:cmf_get_image_preview_url($vo['map_img'])}" height="60px;"></img>
								<else>
									暂无教室地图
								</if>
							</td>
						</tr>
					</foreach>
				</table>
				<ul class="pagination">{$page|default=''}</ul>
			</form>
			</if>
		</div>
	</div>
</div>
<script src="__STATIC__/js/admin.js"></script>
<script>

	function getTree() {
		// Some logic to retrieve, or generate tree structure
		var tree = {$category_tree};
		return tree;
	}
	$('#tree').treeview({data: getTree()});

	$('#tree').on('nodeSelected', function(event, data) {
	  // 事件代码...
		var e = eval(data.href);
		$("tr[name]").hide();
		$.each(e,function(key,v){
			<!-- alert(val.post_id); -->
			$("input[name='ids[]']").each(function () {
				if (($(this).is(':checked'))&&($(this).val()!=v.post_id)) {
					$("input[value='"+$(this).val()+"']").prop("checked",false);
					$("tr[name="+$(this).val()+"]").prop("class",false);
				}
			});
			$("tr[name='"+v.post_id+"']").show();
		});
	});	

	$(function(){
		$("tr[name]").click(function(){
			var id = $(this).attr("name");
			$("input").prop("checked",false);
			$("tr[name]").prop("class",false);
			$("input[value='"+id+"']").prop("checked",true);
			$(this).prop("class","success");
		});
	});
</script>
<script>
    function confirm() {
        var selectedCategoriesId   = [];
        var selectedCategoriesName = [];
        var selectedCategories     = [];
		$("input[name='ids[]']").each(function () {
			if ($(this).is(':checked')) {
				selectedCategoriesId.push($(this).val());
				selectedCategoriesName.push($(this).data('name'));
				<!-- console.log($(this).data('name')); -->
				selectedCategories.push({
					id: $(this).val(),
					name: $(this).data('name')
				});
			}
		});

        return {
            selectedCategories: selectedCategories,
            selectedCategoriesId: selectedCategoriesId,
            selectedCategoriesName: selectedCategoriesName
        };
    }
</script>
</body>
</html>